<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<%@ include file="/WEB-INF/views/include/head.jsp"%>
<link rel="stylesheet" href="${ctxStatic}/css/list.css">
<script type="text/javascript">
    /*下拉框信息信息查询*/
    function selectAcc(id){
    
        strs=id.split("-"); 
        var cd=strs[0];
        var id=strs[1];
        id=cd+id;
    
        if($("#"+id).prop("disabled")){
           
           $("#"+id).removeAttr("disabled");
           var param={"code":strs[1]};
           $.post("${ctx}/style/mystyle/formtwotoptwo",param,function(result){
               var html="<option value=''><spring:message code="order_please_choose"/></option>";
               $.each(result,function(i,e){
                   html+="<option value='"+e.styleOption.itemCd+"-"+e.styleOption.itemValue+"'>"+e.styleOption.itemNameCn+"</option>";
               });
               $("#"+id).html(html);
               var name = $("#"+id).parent().parent().find("p").text();
               $("#"+id).attr("data-rule-required","true");
               $("#"+id).attr("data-msg-required","请选择"+name);
           },'json');
           
        } else {
               $("#"+id).attr("disabled","disabled");
               $("#"+id).attr("data-rule-required","false");
               $("#"+id).attr("data-msg-required","");
               var html="<option value=''><spring:message code="order_please_choose"/></option>";
               $("#"+id).html(html);
               changeTitleInfo();
        }
    }
    
    
    /*下拉框信息信息查询*/
    function selectAcc2(id){
    
        var oldId = id;
        var strs=id.split("-"); 
        var cd=strs[0];
        var id=strs[1];
        $("#" + oldId + "SE").val(null);
        id=cd+id;
           
           $("#"+id).removeAttr("disabled");
           var param={"code":strs[1]};
           $.post("${ctx}/style/mystyle/formtwotoptwo",param,function(result){
               var html= "<select class='form-control sexLg' onchange='changeTitleInfo()' name='accessoriesOptionList' disabled='disabled' id='" + id +"'>";
               html+="</select>";
               $("#"+id + "C").html(html);
               var idCK = id + "CK";
               var html2 = '<input type="checkbox" name="accessoriesItemList" value="' + oldId + '"  onclick="selectAcc(\'' + oldId + '\' )">';
               $("#"+ idCK).html(html2);
               $("#" + oldId).val(null);
               changeTitleInfo();
           },'json');
          
       

    }
    
    
    /*标题*/
    function changeTitleInfo() {

        var params = $("#inputForm").serialize();

        $.post("${ctx}/order/createOrder/titleShow2?typeFlag=4&&id=0", params, function(result) {
        
            var h = $(callBackHtml(result)).find("#title").html();
            $('#title').html(h);
            var windowH2 = window.parent.windowHIframe;
            $('.TxtInfoSm1,.scrollBox').css('height', windowH2 - 368);
        }, 'html');

    }
    
    /*保存方法*/
    var saveForm={
        s:null,
        save:function(s){
                this.s=s;
               // if (!validate()){
                    //return;
                //}
                $("#inputForm").validate({
                    submitHandler : function() {
                        var params = $("#inputForm").serialize();
                        $.post("${ctx}/order/createOrder3/saveOrderToSession4", params, function(result) {
                            
                            // 有错误
                            if (result == "false") {
                                $("#inputForm")[0].reset();
                            }
                             // 跳转至第二页面
                            else {
                                window.location.href="${ctx}/order/createOrder3/form5?id=0";
                            }
                        }, 'json');
                    }
                });
                
                $("#inputForm").validate({});
                $("#inputForm").submit(); 
        }
     }
    
    /*入力是否合法*/
    function validate() {

        // checkBox
        var cb = $("input[name='accessoriesItemList']");
        // option
        var op = $("select[name='accessoriesOptionList']");
        
        for (var i = 0 ; i < cb.length; i ++) {
            // 加值，减值只能入力其中一个数据
            if (cb[i].checked) {
                if(op[i].value == null || $.trim(op[i].value) == "" || op[i].value == "null") {
                    // 请选择相应选项
                    layer.msg('<spring:message code="order_please_choose_option_item"/>', {time:1000}); 
                    return false;
                }
               
            }
        }
       return true;
    }
</script>
</head>
<body>
    <div class="myshop">
        <!-- 创建订单 -->
        <p class="myshoptop"><spring:message code="order_create_order"/></p>
    </div>

    <div class="myshop_middle_order">
        <!-- 标题 -->
        <div class="orderTit orderTitShow clearfix">
              <div class="titSm off">
                <!-- 基本信息 -->
                <p><spring:message code="order_basic_info"/></p>
                <img src="${ctxStatic}/images/order_01_off.png">
            </div>
            <div class="titSm off" onclick='window.location.href="${ctx}/order/createOrder2/initUpdateOrder2?id=${order.id}"'>
                <!-- 量体信息 -->
                <p><spring:message code="order_fit_property_info"/></p>
                <img src="${ctxStatic}/images/order_02_off.png">
            </div>
            <div class="titSm off" onclick='window.location.href="${ctx}/order/createOrder3/form3?id=${order.id}"'>
                <!-- 款式定制 -->
                <p><spring:message code="order_style_customization"/></p>
                <img src="${ctxStatic}/images/order_03_off.png">
            </div>
            <div class="titSm off" onclick='window.location.href="${ctx}/order/createOrder3/form4?id=${order.id}"' >
                <!-- 辅料 -->
                <p><spring:message code="order_accessory"/></p>
                <img src="${ctxStatic}/images/order_04_off.png" >
            </div>
            <div class="titSm off" onclick='window.location.href="${ctx}/order/createOrder3/form5?id=${order.id}"'>
                <!-- 配料 -->
                <p><spring:message code="order_burdening"/></p>
                <img src="${ctxStatic}/images/order_05_on.png">
            </div>
            <div class="titSm off" onclick='window.location.href="${ctx}/order/createOrder3/form6?id=${order.id}"'>
                <!-- 刺绣 -->
                <p><spring:message code="order_embroidery"/></p>
                <img src="${ctxStatic}/images/order_06_on.png">
            </div>
            <div class="titSm off" onclick='window.location.href="${ctx}/order/createOrder3/form7?id=${order.id}"'>
                <!-- 标牌 -->
                <p><spring:message code="order_brand"/></p>
                <img src="${ctxStatic}/images/order_07_on.png">
            </div>
            <div class="titSm off" onclick='window.location.href="${ctx}/order/createOrder3/form8?id=${order.id}"'>
                <!-- 售价 -->
                <p><spring:message code="order_sales_price"/></p>
                <img src="${ctxStatic}/images/order_08_on.png">
            </div>
        </div>

        <div class="top_first clearfix">
            <div class="contentBox cnBx">
                <!-- 辅料 -->
                <p class="contentTit cnBy"><spring:message code="order_accessory"/></p>
                <div class="formBox scrollBox">
                    <form id="inputForm">
                        <input name="id" type="hidden" value="0"/>
                        <c:forEach items="${AccessoriesTopList}" var="item" varStatus="status">
                        <!-- 此值是否显示Flag -->
                        <c:set var="inputFlag" scope="page" value="0"></c:set>
                        <!-- 折行开始 -->
                        <c:if test="${status.index%2 == 0}">
                            <div class="data clearfix">
                        </c:if>
                            <!-- 右数据 -->
                            <c:if test="${status.index%2 == 0}">
                                <div class="ch_middle fl">
                            </c:if>
                            <!-- 左数据 -->
                            <c:if test="${status.index%2 == 1}">
                                <div class="ch_middle fr">
                            </c:if>

                                <c:forEach items="${ShowOptionList}" var="itemShow" varStatus="itemStatus">
                                    <c:if test="${item.styleOption.itemCd == itemShow.itemCD}">
                                        <c:set var="inputFlag" scope="page" value="1"></c:set>
                                        <c:set value="${itemShow.itemValue}"  var="itemShowCd"/>
                                        <c:set value="${itemShow.optionValue}"  var="itemShowoptionValue"/>
                                        <div class="ckBox1 fl" id="${item.styleOption.itemCd}${item.styleOption.itemValue}CK">
                                            <input type="checkbox" checked name="accessoriesItemList" value='${item.styleOption.itemCd}-${item.styleOption.itemValue}' onclick="selectAcc2('${item.styleOption.itemCd}-${item.styleOption.itemValue}')">
                                        </div>
                                        <div class="fl clearfix orderSelectBox notpointer">
                                        <p class="rtname data_id">${item.styleOption.itemNameCn}</p>
                                        </div>
                                        <div class="slev1" id="${item.styleOption.itemCd}${item.styleOption.itemValue}C" >
                                            <select class="form-control sexLg"  name="accessoriesOptionList" onchange="changeTitleInfo()">
                                                <c:forEach items="${fns:getDesignOptionList(itemShow.itemValue)}" var="designOption">
	                                                <option value="${designOption.itemCD}-${designOption.itemValue}"  
	                                                 <c:if test="${designOption.itemCD eq itemShowCd && designOption.itemValue eq itemShowoptionValue}"  >
	                                                    selected=selected
	                                                </c:if> >
	                                                    ${designOption.itemName}
	                                                </option>
	                                            </c:forEach>
                                            </select>
                                        </div>
                                    </c:if>
                                </c:forEach>
                                    
                                <!-- 如果之前没被显示过 -->
                                <c:if test='${pageScope.inputFlag == "0"}'>
                                    <div class="ckBox1 fl">
                                        <input type="checkbox" name="accessoriesItemList" value='${item.styleOption.itemCd}-${item.styleOption.itemValue}' onclick="selectAcc('${item.styleOption.itemCd}-${item.styleOption.itemValue}')">
                                    </div>
                                    <div class="fl clearfix orderSelectBox notpointer">
                                    <p class="rtname data_id">${item.styleOption.itemNameCn}</p>
                                    </div>
                                    <div class="slev1">
                                        <select class="form-control sexLg" name="accessoriesOptionList" onchange="changeTitleInfo()" disabled id="${item.styleOption.itemCd}${item.styleOption.itemValue}">
                                        </select>
                                    </div>

                                </c:if>
                                    
                                </div>
                        <c:if test="${status.index%2 == 1 || status.index == (fn:length(AccessoriesTopList)-1)}">
                            </div>
                        </c:if>
                    </c:forEach>
                </form>
            </div>
        </div>



        <!-- 订单信息显示 -->
        <%@ include file="/WEB-INF/views/modules/order/orderCreateTitle.jsp"%>

        </div>



        <div class="Pre-box">
            <!-- 上一步 -->
            <div class="Pre-1" onclick='window.location.href="${ctx}/order/createOrder3/form3?id=0"'><spring:message code="order_back_step"/></div>
            <!-- 取消 -->
            <div class="Pre-2" onclick="window.parent.frames[0].location.href = '${ctx}/order/order/'"><spring:message code="order_cancel"/></div>
            <!-- 下一步 -->
            <div class="Pre-1" onclick="saveForm.save(0);"><spring:message code="order_next_step"/></div>
        </div>
    </div>
    <script>
    var windowH2 = window.parent.windowHIframe
    $('.TxtInfoSm1,.scrollBox').css('height',windowH2 - 368);
    var listH = $(':root').css('height')
    $(window.parent.$("#mainFrame").css('height',listH));
</script>
</body>
</html>